<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./demo.css">
    <title>Document</title>
</head>

<body>
    <div class="bigBox">
        <!-- ============== 左边 ==============-->
        <div class="left">
            <!-- 左边顶部第一个盒子 -->
            <div class="left_top">
                <!--  -->
                <div class="left_item_p">当前对比数据</div>
                <h1>3,456,789</h1>
            </div>

            <div class="left_item2">违法犯罪人员分析</div>
            <!-- 左边中间图饼 -->
            <div class="left_item3"></div>
            <div class="left_item2">入口出入记录</div>
            <!-- 左边下间表格 -->
            <div class="left_item4">
                <ul class="ul_top">
                    <li>姓名</li>
                    <li>角色</li>
                    <li>开门方式</li>
                    <li>时间</li>
                </ul>
                <ul class="ul_item">
                    <li>张梦</li>
                    <li>访客</li>
                    <li>人脸</li>
                    <li>2018-11-01</li>
                </ul>
                <ul class="ul_item">
                    <li>张梦</li>
                    <li>访客</li>
                    <li>人脸</li>
                    <li>2018-11-01</li>
                </ul>
                <ul class="ul_item">
                    <li>张梦</li>
                    <li>业主</li>
                    <li>人脸</li>
                    <li>2018-11-01</li>
                </ul>
                <ul class="ul_item">
                    <li>张梦</li>
                    <li>访客</li>
                    <li>人脸</li>
                    <li>2018-11-01</li>
                </ul>
                <ul class="ul_item">
                    <li>张梦</li>
                    <li>业主</li>
                    <li>人脸</li>
                    <li>2018-11-01</li>
                </ul>
            </div>
        </div>
        <div class="left_img"></div>
        <!-- ============== 中间 ==============-->
        <div class="conten">
            <!-- 顶部名称 -->
            <div class="conten_item1">
                <img src="./素材图/police.ico" alt="">
                <span>智慧社区内网对比平台</span>
            </div>

            <!-- 天气栏 -->
            <div class="conten_item2">
                <div class="conten_item2_left">
                    <div class="conten_item2_left_a">
                        <p>16:19:50</p>
                        <span>2020/1/21 pm 周2</span>
                    </div>
                    <div class="conten_item2_left_b"></div>
                    <div class="conten_item2_left_c">
                        <img src="./素材图/weather/weather_img01.png" alt="">
                        <section>
                            <p>多云</p>
                            <p>16-22°C</p>
                            <p>天津市和平区</p>
                        </section>
                    </div>
                </div>
                <div class="conten_item2_img"></div>
                <div class="conten_item2_right">
                    <p class="conten_item2_right_a">NO.1北京：2543289人</p>
                    <p class="conten_item2_right_b">NO.1天津：5690人</p>
                    <p class="conten_item2_right_c">NO.1河北：456人</p>
                </div>
            </div>

            <!-- 犯罪人口 -->
            <div class="conten_item3">犯罪人口来源分析</div>
            <!-- 地图 -->
            <div class="conten_item4  conten-img">

            </div>


            <!-- line-blue.png -->
        </div>
        <div class="right_img"></div>
        <!-- ============== 右边 ==============-->
        <div class="right">
            <div class="right_item1">违法犯罪人员年龄分析</div>
            <!-- 右边顶部图饼 -->
            <div class="right_item2"></div>
            <div class="right_item1">违法犯罪人员地区分布</div>
            <!-- 右边中间柱形图 -->
            <div class="right_item3"></div>
            <div class="right_item1">人口出入时间段统计</div>
            <!-- 右边底部折线图 -->
            <div class="right_item4"></div>
        </div>
    </div>
</body>

<script src="./echarts.min.js"></script>
<script type="module">
    // ==========================左边顶部饼图
    const myChartDom5 = document.querySelector('.left_item3')
    const myChart5 = echarts.init(myChartDom5)
    const config1 = {
        tooltip: {
            // trigger: 'item'

        },
        legend: {
            orient: 'vertical', // 换行
            left: 'left',  // 向左
            textStyle: {  // 颜色
                color: '#ddd'
            }
        },
        label: {
            color: 'vertical'  // 颜色，去除白色的边框
        },
        series: [
            {
                type: 'pie',
                // label:false, // 指示的文字消失，悬浮上去才会出现
                radius: ['0%', '50%'],
                center: ['50%', '70%'],
                data: [
                    {
                        name: '卖淫嫖娼',
                        value: 15,
                    },
                    {
                        name: '经侦嫌疑',
                        value: 15,
                    },
                    {
                        name: '重点人口',
                        value: 10,
                    },
                    {
                        name: '刑侦重点',
                        value: 5,
                    }, {
                        name: '吸毒人口',
                        value: 60,

                    }
                ]
            }
        ]
    }
    myChart5.setOption(config1)

    // ====================================右边顶部圆图饼
    const myChartDom2 = document.querySelector('.right_item2')
    const myChart2 = echarts.init(myChartDom2)
    const config2 = {
        title: {
            // textStyle: {
            //     color: '#fff'
            // },
            text: '',
            subtext: '单位：岁',
            right: 'right',

        },
        tooltip: {
            trigger: 'item'
        },
        // color:["plum",'green','yellow','red','skyblue'],   // 更改饼形的每一个颜色
        label: {
            color: 'vertical'  // 颜色，去除白色的边框
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            textStyle: {
                color: '#ddd'
            }
        },
        series: [
            {
                type: 'pie',
                radius: ['25%', '50%'], // 这个是圆心与外圈的圆，第一个值为0就是没有中心圆
                center: ['50%', '70%'],  // 位置，第一个值是距左的距离，第二个是距顶的距离
                label: false, // 指示的文字消失，悬浮上去才会出现
                data: [
                    {
                        name: '18-30',
                        value: 15,
                    },
                    {
                        name: '31-40',
                        value: 15,
                    },
                    {
                        name: '41-50',
                        value: 10,
                    },
                    {
                        name: '51-60',
                        value: 5,
                    }, {
                        name: '60岁以上',
                        value: 5,
                    }
                    , {
                        name: '未标明',
                        value: 60,
                    }
                ]
            }
        ]
    }
    myChart2.setOption(config2)

    // ====================================右边中间柱形图
    const myChartDom3 = document.querySelector('.right_item3')
    const myChart3 = echarts.init(myChartDom3)
    // const myChart3 = echarts.init(myChartDom3,'dark')
    const config3 = {
        title: {
            text: '',
            subtext: ''
        },

        textStyle: {
            color: '#fadb71',   // 更改折线x，y轴的颜色
        },

        xAxis: {
            data: ['河北', '天津', '北京', '新疆', '内蒙', '宁夏', '河南']
        },
        yAxis: {
            min: 0,
            max: 400,
            splitLine: {   // 更改线
                show: true,
                lineStyle: {
                    type: 'dashed',  // 改为虚线
                }
            },
        },
        series: [
            {
                type: 'bar',
                center: ['50%', '30%'],
                data: [10, 50, 200, 330, 380, 320, 220],
                color: '#fadb71'  // 更改柱形图颜色
            }
        ]
    }
    myChart3.setOption(config3)



    // ====================================右边底部折线图
    const myChartDom4 = document.querySelector('.right_item4')
    const myChart4 = echarts.init(myChartDom4)
    const config4 = {
        title: {
            text: '',
            subtext: '',

        },
        textStyle: {
            color: '#5ab310',
        },

        xAxis: {
            data: ['6.00-9.00', '10:00-12:00', '13:00-15:00', '16:00-20:00', '21:00-24:00'],

        },
        yAxis: {
            min: 0,
            max: 800,

        },

        series: [
            {
                type: 'line',
                data: [800, 300, 500, 800, 300],
                smooth: true,  // 折线变为平滑
                color: '#5ab310',

            }
        ]
    }
    myChart4.setOption(config4)


    // 中间地图
    // ==============中间地图

    import mapData from './mock/map.js'


    console.log(mapData);

    const mychartDom = document.querySelector('.conten-img')
    const myChart = echarts.init(mychartDom)
    echarts.registerMap('china', mapData)

    const option = {
        timeline: {
            data: ['2020-01', '2020-02', '2020-03'],
            axisType: 'category',
            autoPlay: true,
            playInterval: 5000,
            left: '10%',
            right: '10%',
            bottom: '3%',
            width: '80%',
            label: {
                normal: {
                    textStyle: {
                        color: '#ddd',
                    },
                },
                emphasis: {
                    textStyle: {
                        color: '#fff',
                    },
                },
            },
            symbolSize: 10,
            lineStyle: {
                color: '#555',
            },
            checkpointStyle: {
                borderColor: '#777',
                borderWidth: 2,
            },
            controlStyle: {
                showNextBtn: true,
                showPrevBtn: true,
                normal: {
                    color: '#666',
                    borderColor: '#666',
                },
                emphasis: {
                    color: '#aaa',
                    borderColor: '#aaa',
                },
            },
        },
        baseOption: {
            animation: true,
            animationDuration: 1000,
            animationEasing: 'cubicInOut',
            animationDurationUpdate: 1000,
            animationEasingUpdate: 'cubicInOut',
            grid: {
                right: '2%',
                top: '10%',
                bottom: '10%',
                width: '18%',
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow',
                    shadowStyle: {
                        color: 'rgba(150,150,150,0.1)',
                    },
                },
            },
            visualMap: {
                min: 0,
                max: 250,
                left: 'left',
                top: 'bottom',
                text: ['高', '低'],
                textStyle: {
                    color: 'white',
                },
                calculable: true,
                colorLightness: [0.8, 100],
                color: ['#c05050', '#e5cf0d', '#5ab1ef'],
                dimension: 0,
            },
            geo: {
                show: true,
                map: 'china',
                roam: true,
                zoom: 1,
                center: [113.83531246, 34.0267395887],
                label: {
                    emphasis: {
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        borderColor: 'rgba(147, 235, 248, 1)',
                        borderWidth: 1,
                        areaColor: {
                            type: 'radial',
                            x: 0.5,
                            y: 0.5,
                            r: 0.8,
                            colorStops: [{
                                offset: 0,
                                color: 'rgba(147, 235, 248, 0)',
                            },
                            {
                                offset: 1,
                                color: 'rgba(147, 235, 248, .2)',
                            },
                            ],
                            globalCoord: false,
                        },
                        shadowColor: 'rgba(128, 217, 248, 1)',
                        shadowOffsetX: -2,
                        shadowOffsetY: 2,
                        shadowBlur: 10,
                    },
                    emphasis: {
                        areaColor: '#389BB7',
                        borderWidth: 0,
                    },
                },
            },
        },
        options: [{
            xAxis: {
                type: 'value',
                scale: true,
                position: 'top',
                min: 0,
                boundaryGap: false,
                splitLine: {
                    show: false,
                },
                axisLine: {
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                axisLabel: {
                    margin: 1,
                    textStyle: {
                        color: '#aaa',
                    },
                },
            },
            yAxis: {
                type: 'category',
                nameGap: 16,
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisTick: {
                    show: false,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisLabel: {
                    interval: 0,
                    textStyle: {
                        color: '#ddd',
                    },
                },
                data: ['四川', '重庆', '西藏'],
            },
            series: [{
                name: 'light',
                type: 'scatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '四川',
                    value: [103.9526, 30.7617, 3.09],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, null],
                },
                {
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                ],
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                    emphasis: {
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#1DE9B6',
                    },
                },
            },
            {
                type: 'map',
                map: 'china',
                geoIndex: 0,
                aspectScale: 1,
                showLegendSymbol: false,
                label: {
                    normal: {
                        show: false,
                    },
                    emphasis: {
                        show: false,
                        textStyle: {
                            color: '#fff',
                        },
                    },
                },
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: '#031525',
                        borderColor: '#FFFFFF',
                    },
                    emphasis: {
                        areaColor: '#2B91B7',
                    },
                },
                animation: false,
                data: [
                    [{
                        year: '2020-01',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    {
                        year: '2020-01',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-01',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-02',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-02',
                        name: '重庆',
                        value: 14.8,
                        value1: 14.8,
                    },
                    {
                        year: '2020-02',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-03',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    {
                        year: '2020-03',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-03',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-04',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-04',
                        name: '重庆',
                        value: 0.77,
                        value1: 0.77,
                    },
                    {
                        year: '2020-04',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    ],
                    [{
                        year: '2020-05',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-05',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-05',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-06',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-06',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-06',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    ],
                ],
            },
            {
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '四川',
                    value: [103.9526, 30.7617, 3.09],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, null],
                },
                {
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                ],
                showEffectOn: 'render',
                rippleEffect: {
                    brushType: 'stroke',
                },
                hoverAnimation: true,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#1DE9B6',
                        shadowBlur: 10,
                        shadowColor: '#1DE9B6',
                    },
                },
                zlevel: 1,
            },
            {
                type: 'lines',
                zlevel: 2,
                effect: {
                    show: true,
                    period: 5,
                    trailLength: 0.2,
                    symbol: 'arrow',
                    symbolSize: 6,
                },
                lineStyle: {
                    normal: {
                        color: '#1DE9B6',
                        width: 1,
                        opacity: 0.2,
                        curveness: 0.3,
                    },
                },
                data: [
                    [{
                        coord: [103.9526, 30.7617],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: 3.09,
                    },
                    ],
                    [{
                        coord: [108.384366, 30.439702],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: null,
                    },
                    ],
                    [{
                        coord: [91.11, 29.97],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: 0,
                    },
                    ],
                ],
            },
            ],
        },
        {
            xAxis: {
                type: 'value',
                scale: true,
                position: 'top',
                min: 0,
                boundaryGap: false,
                splitLine: {
                    show: false,
                },
                axisLine: {
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                axisLabel: {
                    margin: 1,
                    textStyle: {
                        color: '#aaa',
                    },
                },
            },
            yAxis: {
                type: 'category',
                nameGap: 16,
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisTick: {
                    show: false,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisLabel: {
                    interval: 0,
                    textStyle: {
                        color: '#ddd',
                    },
                },
                data: ['西藏', '重庆', '四川'],
            },
            series: [{
                name: 'light',
                type: 'scatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, 14.8],
                },
                {
                    name: '四川',
                    value: [103.9526, 30.7617, 39.25],
                },
                ],
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                    emphasis: {
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#EEDD78',
                    },
                },
            },
            {
                type: 'map',
                map: 'china',
                geoIndex: 0,
                aspectScale: 1,
                showLegendSymbol: false,
                label: {
                    normal: {
                        show: false,
                    },
                    emphasis: {
                        show: false,
                        textStyle: {
                            color: '#fff',
                        },
                    },
                },
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: '#031525',
                        borderColor: '#FFFFFF',
                    },
                    emphasis: {
                        areaColor: '#2B91B7',
                    },
                },
                animation: false,
                data: [
                    [{
                        year: '2020-01',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    {
                        year: '2020-01',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-01',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-02',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-02',
                        name: '重庆',
                        value: 14.8,
                        value1: 14.8,
                    },
                    {
                        year: '2020-02',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-03',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    {
                        year: '2020-03',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-03',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-04',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-04',
                        name: '重庆',
                        value: 0.77,
                        value1: 0.77,
                    },
                    {
                        year: '2020-04',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    ],
                    [{
                        year: '2020-05',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-05',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-05',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-06',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-06',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-06',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    ],
                ],
            },
            {
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '四川',
                    value: [103.9526, 30.7617, 39.25],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, 14.8],
                },
                {
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                ],
                showEffectOn: 'render',
                rippleEffect: {
                    brushType: 'stroke',
                },
                hoverAnimation: true,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#EEDD78',
                        shadowBlur: 10,
                        shadowColor: '#EEDD78',
                    },
                },
                zlevel: 1,
            },
            {
                type: 'lines',
                zlevel: 2,
                effect: {
                    show: true,
                    period: 5,
                    trailLength: 0.2,
                    symbol: 'arrow',
                    symbolSize: 6,
                },
                lineStyle: {
                    normal: {
                        color: '#EEDD78',
                        width: 1,
                        opacity: 0.2,
                        curveness: 0.3,
                    },
                },
                data: [
                    [{
                        coord: [121.4648, 31.2891],
                        value: 39.25,
                    },
                    {
                        coord: [103.9526, 30.7617],
                    },
                    ],
                    [{
                        coord: [121.4648, 31.2891],
                        value: 14.8,
                    },
                    {
                        coord: [108.384366, 30.439702],
                    },
                    ],
                    [{
                        coord: [121.4648, 31.2891],
                        value: 0,
                    },
                    {
                        coord: [91.11, 29.97],
                    },
                    ],
                ],
            },
            ],
        },
        {
            xAxis: {
                type: 'value',
                scale: true,
                position: 'top',
                min: 0,
                boundaryGap: false,
                splitLine: {
                    show: false,
                },
                axisLine: {
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                axisLabel: {
                    margin: 1,
                    textStyle: {
                        color: '#aaa',
                    },
                },
            },
            yAxis: {
                type: 'category',
                nameGap: 16,
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisTick: {
                    show: false,
                    lineStyle: {
                        color: '#ddd',
                    },
                },
                axisLabel: {
                    interval: 0,
                    textStyle: {
                        color: '#ddd',
                    },
                },
                data: ['西藏', '重庆', '四川'],
            },
            series: [{
                name: 'light',
                type: 'scatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, 14.2],
                },
                {
                    name: '四川',
                    value: [103.9526, 30.7617, 49.05],
                },
                ],
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                    emphasis: {
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#32C5E9',
                    },
                },
            },
            {
                type: 'map',
                map: 'china',
                geoIndex: 0,
                aspectScale: 1,
                showLegendSymbol: false,
                label: {
                    normal: {
                        show: false,
                    },
                    emphasis: {
                        show: false,
                        textStyle: {
                            color: '#fff',
                        },
                    },
                },
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: '#031525',
                        borderColor: '#FFFFFF',
                    },
                    emphasis: {
                        areaColor: '#2B91B7',
                    },
                },
                animation: false,
                data: [
                    [{
                        year: '2020-01',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    {
                        year: '2020-01',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-01',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-02',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-02',
                        name: '重庆',
                        value: 14.8,
                        value1: 14.8,
                    },
                    {
                        year: '2020-02',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-03',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    {
                        year: '2020-03',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-03',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-04',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-04',
                        name: '重庆',
                        value: 0.77,
                        value1: 0.77,
                    },
                    {
                        year: '2020-04',
                        name: '四川',
                        value: 3.09,
                        value1: 3.09,
                    },
                    ],
                    [{
                        year: '2020-05',
                        name: '四川',
                        value: 39.25,
                        value1: 39.25,
                    },
                    {
                        year: '2020-05',
                        name: '重庆',
                        value: null,
                        value1: null,
                    },
                    {
                        year: '2020-05',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    ],
                    [{
                        year: '2020-06',
                        name: '西藏',
                        value: 0,
                        value1: 0,
                    },
                    {
                        year: '2020-06',
                        name: '重庆',
                        value: 14.2,
                        value1: 14.2,
                    },
                    {
                        year: '2020-06',
                        name: '四川',
                        value: 49.05,
                        value1: 49.05,
                    },
                    ],
                ],
            },
            {
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: [{
                    name: '四川',
                    value: [103.9526, 30.7617, 49.05],
                },
                {
                    name: '重庆',
                    value: [108.384366, 30.439702, 14.2],
                },
                {
                    name: '西藏',
                    value: [91.11, 29.97, 0],
                },
                ],
                showEffectOn: 'render',
                rippleEffect: {
                    brushType: 'stroke',
                },
                hoverAnimation: true,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                    },
                },
                itemStyle: {
                    normal: {
                        color: '#32C5E9',
                        shadowBlur: 10,
                        shadowColor: '#32C5E9',
                    },
                },
                zlevel: 1,
            },
            {
                type: 'lines',
                zlevel: 2,
                effect: {
                    show: true,
                    period: 5,
                    trailLength: 0.2,
                    symbol: 'arrow',
                    symbolSize: 6,
                },
                lineStyle: {
                    normal: {
                        color: '#32C5E9',
                        width: 1,
                        opacity: 0.2,
                        curveness: 0.3,
                    },
                },
                data: [
                    [{
                        coord: [103.9526, 30.7617],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: 49.05,
                    },
                    ],
                    [{
                        coord: [108.384366, 30.439702],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: 14.2,
                    },
                    ],
                    [{
                        coord: [91.11, 29.97],
                    },
                    {
                        coord: [121.4648, 31.2891],
                        value: 0,
                    },
                    ],
                ],
            },
            ],
        },
        ],
    }

    myChart.setOption(option)








</script>

</html>